<template>
  <div
    class="disCell_input"
    :style="{ background: isFromPreProject ? '#F5F7FA' : '', color: isFromPreProject ? '#C0C4CC' : '' }"
  >
    <span class="inner">{{ value }}</span>
    <span class="suffix"></span>
  </div>
</template>

<script>
export default {
  name: "InputDisText",
  props: ["value", "isFromPreProject"],
};
</script>

<style lang="scss" scoped>
.disCell_input {
  display: flex;
  align-items: center;
  height: 32px;
  padding: 0 0 0 0.75rem;
  overflow: hidden;
  font-size: 14px;
  line-height: 32px;
  border: 1px solid #bac3d3;
  border-radius: 4px;

  & > span.inner {
    flex: 1;
    height: 100%;
    overflow: hidden;
    white-space: nowrap;
  }

  & > span.prefix,
  & > span.suffix {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    color: #c0c4cc;
  }
}
</style>
